<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>选择分类</title>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/style_zj.css">
    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="../fonts/iconfont.css">
</head>
<body>
<!--<div id="header_01_html">
    <iframe id="header_01" src="head_01.html" frameborder="0"></iframe>
</div>-->
<div class="content-box" id="vue-box" v-cloak>
    <!--<div id="left_tab_html">
        <iframe id="left_tab" src="left_tab.html?x=1&y=1" frameborder="0"></iframe>
    </div>-->

    <div class="right-box layui-form">
        <div class="friend-tips">
            <div class="title-box"><i class="icon-sty"></i><b class="title-tip">温馨提示</b></div>
            <div class="info-list">1、在这里您可以批量修改产品的标准品类，请正确选择产品品类</div>
            <div class="info-list">2、此处为商业信息发布，为了维护你的商业形象，请如实准备填写信息</div>
        </div>
        <div class="content-admin">

            <div class="title-toggle js-getType">
                <div class="item active1 item-sty1" data-type="0">发布供应信息</div>
                <div class="item item-sty1" data-type="1">发布求购信息</div>
            </div>
            <div class="choose-title">选择产品分类</div>
            <div class="class-content clearfix">
                <div class="class-level">
                    <div class="item" @click="getSList(index,item.name)" v-for="(item,index) in allList"><span>{{item.name}}</span><i
                            class="icon-sty1 icon_right1"></i></div>
                </div>
                <div class="class-level">
                    <div class="item" @click="getTList(index,item.name)" v-for="(item,index) in sList"><span>{{item.name}}</span><i
                            class="icon-sty1 icon_right1"></i></div>
                </div>
                <div class="class-level">
                    <div class="item" @click="getTName(index,item.name)" v-for="(item,index) in TList"><span>{{item.name}}</span><i
                            class="icon-sty1"></i></div>

                </div>
            </div>
            <div class="selected-text">您当前所选的类目：<span class="color-home">{{nameF}}  {{nameS?'>':''}}  {{nameS}}   {{nameT?'>':''}}  {{nameT}}</span>
            </div>
            <div class="text-c pb-20"><span class="btn-sty11 box-shadow-sty1 js-goRelease">下一步，填写详细信息</span></div>
        </div>
    </div>
</div>
<!--<div>
    <iframe src="footer-record.html" style="width: 100%;border: none;height:60px;"></iframe>
</div>-->

<script src="../layui/layui.all.js"></script>
<script src="../js/jquery-3.3.1.min.js"></script>
<script src="../js/vue.js"></script>
<script src="../js/common.js"></script>


<script>

    if (getUrlParam('type') == 1) {
        $('.js-getType').find('.item:first-child').removeClass('active1').siblings('.item').addClass('active1');
    }


    var type = '';
    var app = new Vue({
        el: '#vue-box',
        data: {
            fList: [],
            sList: [],
            TList: [],
            chooseF: '',
            chooseS: '',
            nameF: '',
            nameS: '',
            nameT: '',
            allList: [],
        },
        mounted: function () {
            get_ajax("/sys/storeCommodityType/getAllList", {}, function (data) {
                app.allList = data;
            })
        },
        methods: {
            getSList: function (index, name) {
                this.nameF = name;
                this.sList = this.allList[index].subordinate;
                this.TList = [];
            },
            getTList: function (index, name) {
                this.TList = this.sList[index].subordinate;
                this.nameS = name;
            },
            getTName: function (index, name) {
                this.nameT = name;
            }
        }
    });

    $('.js-getType').on('click', '.item', function () {
        $(this).addClass('active1').siblings().removeClass('active1');
    })

    $('body').on('click', '.class-level .item', function () {
        var index = $(this).parent().index();
        $(this).addClass('active').siblings().removeClass('active');
        if (index < 2) {
            $(this).parent().next().find(".item").removeClass('active');
        }
    })

    $('.js-goRelease').on('click', function () {
        if (!app.nameT) {
            layer.msg('请选择分类')
            return
        }
        var bread = $(".color-home").text();
        var type = $('.js-getType').find('.active1').attr('data-type');
        var url = type == 0 ? 'release_supply.html?bread=' + bread : 'release_purchase.html?bread=' + bread;
        location.href = url;
    })


</script>
</body>
</html>